<%--
  Created by IntelliJ IDEA.
  User: 朱志俊
  Date: 2021/9/16
  Time: 11:01
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<html>
<head>
    <title>Title</title>
    <link type="text/css" rel="stylesheet" href="css/style.css" />
    <script type="text/javascript" src="js/jquery-1.8.2.min.js"></script>
    <script type="text/javascript" src="js/banner.js"></script>
    <script type="text/javascript" src="js/clickNum.js"></script>
    <script type="text/javascript">
        $(document).ready(function(){
            $("ul.typeul .typeone").click(function()
            {
                var arrow = $(this).find("span.arrow");
                if(arrow.hasClass("up"))
                {
                    arrow.removeClass("up");
                    arrow.addClass("down");
                }
                else if(arrow.hasClass("down"))
                {
                    arrow.removeClass("down");
                    arrow.addClass("up");
                }
                $(this).parent().find(".typetwo").slideToggle();
            });
        })
        $(function () {
            load(null);
        });

        function ConvertJSONDateToJSDateObject(JSONDateString) {

            var date = new Date(JSONDateString);
            var year = date.getFullYear();
            var month = date.getMonth + 1 < 10 ? "0" + (date.getMonth() + 1) : date.getMonth() + 1;
            var currentDate = date.getDate() < 10 ? "0" + date.getDate() : date.getDate();
            // var hour = date.getHours();
            // var minute = date.getMinutes();
            // var second = date.getSeconds();
            var datastr = year + "-" + month + "-" + currentDate;
            return datastr;
        }
        function load(currentPage){
            // <li>
            // <a href="detail.jsp" class="ccsl">字画装裱需要注意什么细节问题?</a>
            // <span>2018-09-04</span>
            // </li>
            $.get("AllNewsServlet",{currentPage:currentPage},function (News){

                var lis = "";
                // var birthdayMilliseconds = parseInt(obj.Birthday.replace(/\D/igm, ""));
                // //实例化一个新的日期格式，使用1970 年 1 月 1 日至今的毫秒数为参数
                // var birthday = new Date(birthdayMilliseconds);

                for (var i = 0; i < News.list.length; i++) {
                    var route = News.list[i];
                    var date = ConvertJSONDateToJSDateObject(route.pubdate);
                    var li = '<li>\n'+
                    //href="javascript:void(0)" onclick="Clickadd()"
                        '<a href="javascript:void(0)" onclick="Clickadd('+route.id+')" class="ccsl">'+route.title+'</a>\n'+
                        '<span>'+date+'</span>\n'+
                        '</li>';
                    lis+=li;
                }
                $("#listul").html(lis);
                window.scroll(0,0);


                var liss = "";
                var fristPage = '<li onclick="javascript:load('+1+')"><a href="javascript:void(0)">首页</a></li>'

                var beforeNum = News.currentPage - 1;
                if(beforeNum<=0){
                    beforeNum=1;
                }
                var beforePage = '<li class="threeword" onclick="javascript:load('+beforeNum+')"><a href="javascript:void(0)">上一页</a></li>';
                liss += fristPage;
                liss += beforePage;

                // 定义开始位置begin,结束位置 end
                var begin; // 开始位置
                var end ; //  结束位置


                //1.要显示10个页码
                if(News.totalPage < 10){
                    //总页码不够10页
                    begin = 1;
                    end = News.totalPage;
                }else{
                    //总页码超过10页

                    begin = News.currentPage - 5 ;
                    end = News.currentPage + 4 ;

                    //2.如果前边不够5个，后边补齐10个
                    if(begin < 1){
                        begin = 1;
                        end = begin + 9;
                    }
                    //3.如果后边不足4个，前边补齐10个
                    if(end > News.totalPage){
                        end = News.totalPage;
                        begin = end - 9 ;
                    }
                }

                for(var i=begin; i<=end;i++){
                    var li;
                    if(News.currentPage==i){
                        li = '<li class="curPage" onclick="javascript:load('+i+')"><a href="javascript:void(0)">'+i+'</a></li>'
                    }else {
                        li = '<li onclick="javascript:load('+i+')"><a href="javascript:void(0)">'+i+'</a></li>'
                    }

                    liss += li;
                }


                var lastPage = '<li class="threeword" onclick="javascript:load('+News.totalPage+')"><a href="javascript:void(0)">末页</a></li>';
                var afterNum = News.currentPage+1;
                if(afterNum>=News.totalPage){
                    afterNum =News.totalPage;
                }
                var nextPage = '<li class="threeword" onclick="javascript:load('+afterNum+')"><a href="javascript:void(0)">下一页</a></li>';

                liss += nextPage;
                liss += lastPage;

                //将lis内容设置到 ul
                $("#pageNum").html(liss);
            });
        }



    </script>
</head>
<body>
<div class="header">
    <div class="main">
        <a href="index.jsp"><img src="images/logo.png" /></a>
    </div>
</div>
<div class="clear"></div>
<div class="nav">
    <ul>
        <li><a href="index.jsp">首页</a></li>
        <li><a href="about.jsp">关于我们</a></li>
        <li><a href="product.jsp">产品展示</a></li>
        <li><a href="news.jsp">行业动态</a></li>
        <li><a href="book.jsp">我要留言</a></li>
        <li><a href="contact.jsp">联系我们</a></li>
    </ul>
</div>
<div class="clear"></div>
<%--<div class="banner">--%>
<%--    <div class="b-img">--%>
<%--        <c:forEach items="${carouselList}" var="carousel">--%>
<%--            <img src="${carousel.getImg()}" width="100%"/>--%>
<%--        </c:forEach>--%>
<%--    </div>--%>
<%--    <div class="clear"></div>--%>
<%--    <div class="b-list"> </div>--%>
<%--</div>--%>
<div class="clear"></div>
<div class="main">
    <div class="mainL">
        <div class="titbox">产品分类</div>
        <ul class="typeul">
            <c:forEach items="${classificationList}" var="classification">
                <li>
                    <c:if test="${classification.getParent_id()==0}">
                        <div class="typeone"><a href="product.jsp">${classification.getCname()}</a><span class="arrow up"></span></div>
                        <c:forEach items="${classificationList}" var="classification2">
                            <c:if test="${classification.getId()==classification2.getParent_id()}">
                                <div class="typetwo">
                                    <a href="product.jsp">${classification2.getCname()}</a>
                                </div>
                            </c:if>
                        </c:forEach>
                    </c:if>

                </li>
            </c:forEach>
<%--            <li>--%>
<%--                <div class="typeone"><a href="product.jsp">人物画</a><span class="arrow up"></span></div>--%>
<%--                <div class="typetwo">--%>
<%--                    <a href="product.jsp">人物画</a>--%>
<%--                    <a href="product.jsp">人物画</a>--%>
<%--                    <a href="product.jsp">人物画</a>--%>
<%--                </div>--%>
<%--            </li>--%>
<%--            <li>--%>
<%--                <div class="typeone"><a href="product.jsp">花鸟画</a><span class="arrow up"></span></div>--%>
<%--                <div class="typetwo">--%>
<%--                    <a href="product.jsp">花鸟画</a>--%>
<%--                    <a href="product.jsp">花鸟画</a>--%>
<%--                    <a href="product.jsp">花鸟画</a>--%>
<%--                </div>--%>
<%--            </li>--%>
<%--            <li>--%>
<%--                <div class="typeone"><a href="product.jsp">山水画</a><span class="arrow up"></span></div>--%>
<%--                <div class="typetwo">--%>
<%--                    <a href="product.jsp">山水画</a>--%>
<%--                    <a href="product.jsp">山水画</a>--%>
<%--                    <a href="product.jsp">山水画</a>--%>
<%--                </div>--%>
<%--            </li>--%>
        </ul>
        <div class="titbox">热门资讯</div>
        <ul class="newsul">
            <c:forEach items="${newsList2}" var="news">
                <li><a href="javascript:void(0)" onclick="Clickadd(${news.getId()})" class="ccsl">${news.getTitle()}</a></li>
            </c:forEach>
<%--            <li><a href="detail.jsp" class="ccsl">字画装裱需要注意什么细节问题?</a></li>--%>
<%--            <li><a href="detail.jsp" class="ccsl">书画装裱后更应妥善保存，存放在地上要考虑防潮?</a></li>--%>
<%--            <li><a href="detail.jsp" class="ccsl">字画装裱机的选择需要注意那几点呢？</a></li>--%>
<%--            <li><a href="detail.jsp" class="ccsl">保管已经破损的古旧字画更要谨慎?</a></li>--%>
<%--            <li><a href="detail.jsp" class="ccsl">展示手绢，册页时要倍加注意?</a></li>--%>
        </ul>
        <div class="titbox">联系我们</div>
        <div class="lxwm">
            <div class="con">
                手 机：12345678910<br />
                电 话：77000000<br />
                邮箱：123***@qq.com<br />
                地 址：银河系太阳系帝王星华夏民族
            </div>
        </div>
    </div>
    <div class="mainR">
        <div class="brandnavbox">
            <h2>行业动态</h2>
            <div class="con">当前位置：首页》行业动态</div>
        </div>
        <ul class="listul" id="listul">
            <li><a href="detail.jsp" class="ccsl">字画装裱需要注意什么细节问题?</a><span>2018-09-04</span></li>
            <li><a href="detail.jsp" class="ccsl">书画装裱后更应妥善保存，存放在地上要考虑防潮?</a><span>2018-09-04</span></li>
            <li><a href="detail.jsp" class="ccsl">字画装裱机的选择需要注意那几点呢？</a><span>2018-09-04</span></li>
            <li><a href="detail.jsp" class="ccsl">保管已经破损的古旧字画更要谨慎?</a><span>2018-09-04</span></li>
            <li><a href="detail.jsp" class="ccsl">展示手绢，册页时要倍加注意?</a><span>2018-09-04</span></li>
            <li><a href="detail.jsp" class="ccsl">字画装裱需要注意什么细节问题?</a><span>2018-09-04</span></li>
            <li><a href="detail.jsp" class="ccsl">书画装裱后更应妥善保存，存放在地上要考虑防潮?</a><span>2018-09-04</span></li>
            <li><a href="detail.jsp" class="ccsl">字画装裱机的选择需要注意那几点呢？</a><span>2018-09-04</span></li>
            <li><a href="detail.jsp" class="ccsl">保管已经破损的古旧字画更要谨慎?</a><span>2018-09-04</span></li>
            <li><a href="detail.jsp" class="ccsl">展示手绢，册页时要倍加注意?</a><span>2018-09-04</span></li>
            <li><a href="detail.jsp" class="ccsl">字画装裱需要注意什么细节问题?</a><span>2018-09-04</span></li>
            <li><a href="detail.jsp" class="ccsl">书画装裱后更应妥善保存，存放在地上要考虑防潮?</a><span>2018-09-04</span></li>
            <li><a href="detail.jsp" class="ccsl">字画装裱机的选择需要注意那几点呢？</a><span>2018-09-04</span></li>
            <li><a href="detail.jsp" class="ccsl">保管已经破损的古旧字画更要谨慎?</a><span>2018-09-04</span></li>
            <li><a href="detail.jsp" class="ccsl">展示手绢，册页时要倍加注意?</a><span>2018-09-04</span></li>
        </ul>
        <div class="clear"></div>
        <div class="pagebox">
            <ul id="pageNum">

            </ul>
            <%--            <a href="">上一页</a>--%>
            <%--            <a href="">1</a>--%>
            <%--            <a href="">2</a>--%>
            <%--            <a href="">3</a>--%>
            <%--            <a href="">下一页</a>--%>
            <%--        </div>--%>
        </div>
    </div>
    <div class="clear"></div>
</div>
<div class="clear"></div>
<div class="footerBox">
    <div class="main">
        <div class="footL">
            <div class="tit">联系我们</div>
            <ul>
                <li class="f1">手 机：12345678910</li>
                <li class="f2">电 话：77000000</li>
                <li class="f3">邮箱：123***@qq.com</li>
                <li class="f4">地 址：银河系太阳系帝王星华夏民族</li>
            </ul>
        </div>
        <div class="footR">
            <div class="telbox">
                <div class="tel">
                    <span>12345678910</span>
                    <b><p>欢迎来电咨询</p></b>
                </div>
            </div>
            <div class="footer">
                <div>水墨画有限公司<br />联系方式：12345678910<br />地 址：银河系太阳系帝王星华夏民族</div>
            </div>
        </div>
    </div>
</div>
<div class="clear"></div>
<div class="fnav">
    <div class="main">
        <a href="index.jsp">首页</a>
        <a href="about.jsp">关于我们</a>
        <a href="product.jsp">产品展示</a>
        <a href="news.jsp">行业动态</a>
        <a href="book.jsp">我要留言</a>
        <a href="contact.jsp">联系我们</a>
    </div>
</div>
</body>
</html>
